/**
 * Created by wzj on 2017/4/10.
 */
/**
 * 模态框
 */
var Modal = React.createClass({
	//已插入真实 DOM 之后
	componentDidMount: function() {
		//初始化modal
		$(this.refs.root).modal({backdrop: 'static', keyboard: false, show: true});
		//modal关闭后执行事件
		$(this.refs.root).on('hidden.bs.modal', this.handleHidden);
	},
	//更新之前
	componentWillUpdate:function(){

	},
	//更新之后
	componentDidUpdate:function(){

	},
	//已移出真实 DOM
	componentWillUnmount: function() {
		console.log("2",this,this.refs)
	},

	render:function(){
		var confirmButton = null;
		var cancelButton = null;

		if(this.props.confirm){
			confirmButton = (<Button className="btn-primary" onClick={this.handleConfirm}>{this.props.confirm}</Button>);
		}
		if(this.props.cancel){
			cancelButton = (<Button className="btn-default" onClick={this.handleCancel}>{this.props.cancel}</Button>);
		}

		return (
			<div className="modal fade in" ref="root">
				<div className={this.props.title == null?"modal-dialog hideHeader":""}>
					<div className="modal-content">
						<div className="modal-header">
							<button className="close" type="button" onClick={this.handleCancel}>&times;</button>
							<h3>{this.props.title}</h3>
						</div>
						<div className="modal-body">
							{this.props.children}
						</div>
						<div className="modal-footer">
							{cancelButton}
							{confirmButton}
						</div>
					</div>
				</div>
			</div>
		)
	},
	//打开模态窗
	open:function(){
		$(this.refs.root).modal("show");
	},
	//关闭模态框
	close:function(){
		$(this.refs.root).modal("hide");
	},
	//确认框确定按钮事件
	handleConfirm:function(){
		if(this.props.onConfirm){
			this.props.onConfirm();
		}
		this.close();
	},
	//确认框取消按钮事件
	handleCancel:function(){
		if(this.props.onCancel){
			this.props.onCancel();
		}
		this.close();
	},
	handleHidden:function(){
		if(this.props.onHidden){
			this.props.onHidden();
			this.close();
		}
	}
});
var Button = React.createClass({
	render:function(){
		return (
			<a {...this.props}
		href="javascript:;"
		role="button" className={(this.props.className || '') + ' btn'} />
		)
	}
});